<template>
	<view class="container">
		<view style="width: 100%;height: 10%;margin-bottom: 32px;" >
			<view>
				<image style="width: 80rpx;height:80rpx;margin-left: 50rpx;position: relative;top:95rpx;"
					class="shrink-0 image_3"
					src="http://101.43.223.224:8765/image/getImageById?id=6756" />
			</view>
			<view class="div2">
				<view class="div2-2"
					style="display: flex; align-items: center; justify-content: center;color: #636363;margin-top: 15rpx;"
					>
					<view style="float: left;">
						<image style="width: 40rpx;height: 40rpx;margin-left: -90rpx;" src="../../static/哑铃.png" alt="">
						</image>
					</view>
					<view style="float: left; margin-left: 10rpx;letter-spacing: 2px;font-size: 28rpx;">
						<text style="font-weight: bold;">追云健身俱乐部</text>
					</view>
				</view>
			</view>
		</view>
		<!-- 性别 -->
		<view style="width: 90%;height: 6vh;text-align: center;background: red;margin-left: 5%;line-height: 6vh;background: rgb(245, 245, 245,0.5);border-radius: 3%;">
			<span style="font-size: 36px;font-weight: 400;">性别</span>
		</view>
		<!-- 文本 -->
		<view style="width: 90%;height: 10vh;text-align: center;margin: 0 auto;">
			<span style="font-size: 18px;font-weight: 400;color: rgba(3, 59, 62, 1);">针对男/女及不同年龄段的训练方法有所差异，完善个人信息，更科学的获取运动指导</span>
		</view>
		<view style="width: 100%;height: 1vh;"></view>
		<view class="boy" @click="changeBoyImage">
			<image :src="boyImage" mode="" class="img1"></image>
		</view>
		<view style="width: 100%;height: 3vh;"></view>
		<view class="girl" @click="changeImage">
			<image :src="imageUrl" mode="" class="img1"></image>
		</view>
		<view style="width: 100%;height: 3vh;"></view>
		<!-- 暂时不绑定 -->
		<view style="width: 80%;height: 9vh;margin: 0 auto;text-align: center;">
			<span style="font-size: 18px;color: rgba(179, 179, 179, 1);font-weight: 400;">暂时先不绑定信息，稍后在我的自行完成</span>
		</view>
		<view style="width: 70%;height: 6vh;margin: 0 auto;">
			<view @click="goWelcome()" style="width: 40%;height: 100%;float: left;border: 2px solid rgba(227, 227, 227, 1);border-radius: 48px;text-align: center;">
				<span style="font-size: 20px;color: rgba(133, 133, 133, 1);font-weight: 400;line-height: 6vh;">跳过</span>
			</view>
			<view @click="goAge()" style="width: 40%;height: 100%;float: right;background: linear-gradient(90deg, rgba(15, 227, 242, 1) 0%, rgba(15, 227, 242, 1) 100%);border-radius: 48px;text-align: center;">
				<span style="font-size: 20px;color: rgba(3, 59, 62, 1);font-weight: 400;line-height: 6vh;">确定</span>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
	  data() {
	    return {
			userInfo:{},
			imageUrl: "../../../static/Gender.png",
			boyImage: "../../../static/boy.png"
	    };
	  },
	  created() {
	  	this.userInfo=uni.getStorageSync('userInfo')
	  },
	  methods: {
		//跳过  
		goWelcome(){
			uni.navigateTo({
				url: '/pages/student/chooseLabel/welcome',
				animationType: 'slide-out-top',
				animationDuration: 200
			})
		},
		  // 性别女点击事件
	    changeImage() {
			this.userInfo.memberUserSex=1
	      this.imageUrl = "../../../static/girl.png"; // 更改为您想要更换的图像路径
		  this.boyImage = "../../../static/boy.png"; // 更改为您想要更换的图像路径
	    },
		 // 性别男点击事件
		changeBoyImage () {
			this.userInfo.memberUserSex=0
			this.imageUrl = "../../../static/Gender.png"; // 更改为您想要更换的图像路径
			this.boyImage = "../../../static/Gender 2.png"; // 更改为您想要更换的图像路径
		},
		goAge () {
			uni.setStorageSync('userInfo',this.userInfo)
			if(this.userInfo.memberUserSex==null){
				uni.$u.toast('请选择性别');
			}else{
				uni.request({
					url: "http://127.0.0.1:17000/memberUser/updateMemberInfoById",
					method: "POST",
					data:this.userInfo,
					success: (res) => {
						if (res.data.code == 200) {
							console.log("成功了")
						}
					}
				})
				if(this.userInfo.memberUserAge==null){
					uni.navigateTo({
						url: '/pages/student/chooseLabel/age',
						animationType: 'slide-out-top',
						animationDuration: 200
					})
				}else if(this.userInfo.memberUserWeight==null){
					uni.navigateTo({
						url: '/pages/student/chooseLabel/weight',
						animationType: 'slide-out-top',
						animationDuration: 200
					})
				}else if(this.userInfo.memberUserHeight==null){
					uni.navigateTo({
						url: '/pages/student/chooseLabel/bodyHeight',
						animationType: 'slide-out-top',
						animationDuration: 200
					})
				}else{
					uni.navigateTo({
						url: '/pages/student/chooseLabel/welcome',
						animationType: 'slide-out-top',
						animationDuration: 200
					})
				}
			}
		},
	  }
	};
</script>

<style>

	/* 设置背景图片 */
	.container {
		width: 100%;
		height: 100vh;
		 /* display: flex; */
		justify-content: center;
		align-items: center;
		background-image: url('http://101.43.223.224:8765/image/getImageById?id=6755');
		background-size: cover; /* 使背景图片覆盖整个页面 */
		/* background-repeat:repeat-y; /* 根据y轴重复显示背景图片 */  
	}
	/* 顶部样式 */
	.div2-2 {
		background-color: #F5F5F5;
		border-radius: 20px 20px;
		height: 70rpx;
		width: 60%;
		margin: 0 auto;
	}
	/* 顶部样式 */
	.div2-2 {
		background-color: #F5F5F5;
		border-radius: 20px 20px;
		height: 70rpx;
		width: 60%;
		margin: 0 auto;
	}
	.girl{
		width: 22vh;
		height: 22vh;
		/* background-color: red; */
		margin: 0 auto;
	}
	.boy{
		width: 22vh;
		height: 22vh;
		/* background-color: red; */
		margin: 0 auto;
	}
	.img1{
		width: 100%;
		height: 100%;
	}
</style>